'use strict';
//业绩展示
import React,{Component} from 'react';
import Header from '../../common/header';
import * as URLconstant from '../../constant/URLconstant'
import Util from '../../common/util';
import YearAchievement from './yearAchievement'
import {
    View,
    Text,
    TouchableOpacity,
    Image,
    StyleSheet,
    ScrollView, ListView
} from 'react-native';
export default class achieveList extends Component{
    // 构造
      constructor(props) {
        super(props);
        // 初始状态
        this.state = {
            dataSource2: new ListView.DataSource({rowHasChanged: (row1, row2) => row1 !== row2}),
            dataSource: [],
            page:1,
            isOver:false,
            loaded:true,
            monthStatistics:null,
            type:1
        };
        this.onEndReached=this.onEndReached.bind(this)
          this._renderRow=this._renderRow.bind(this)
          this.renderFooter=this.renderFooter.bind(this)

      }

    async componentDidMount() {
          if(this.props.type!=undefined){
              LOG('type===='+this.props.type)
              await this.setState({
                  type:this.props.type
              })
          }
        this.getAchieve()
    }

      getAchieve(){
          let url = URLconstant.GET_ACHIEVEMENT_LIST
          let datakey=[]
          datakey['user_id']=this.props.user_id
          datakey['allShop']=this.props.allShop
          datakey['type'] = this.state.type
          datakey['month']=this.props.month
          datakey['page']=this.state.page
          Util.get(url,datakey,this.getAchieveSuc.bind(this),this.errorCallback.bind(this))
      }

    getAchieveSuc(datas){
        if(datas.status==0){
            let isOver = false
            let newDatas = datas.data.orderList;
            let oldDatas = this.state.dataSource;
            let page = this.state.page
            let monthStatistics = datas.data.monthStatistics
            if(page>=datas.data.pageCount){
                isOver=true
            }else{
                page=page+1
            }
            Array.prototype.push.apply(oldDatas, newDatas);
            this.setState({
                isOver:isOver,
                dataSource2: this.state.dataSource2.cloneWithRows(oldDatas),
                dataSource: oldDatas,
                loaded:false,
                page:page,
                monthStatistics:monthStatistics
            })
        }else{
            this.setState({
                isOver:true,
                dataSource: [],
                loaded:false,
                monthStatistics:null
            })
        }
    }
    errorCallback(err){

    }

    async selectType(type){
          if(type==this.state.type){
              return false
          }
          await this.setState({
              type:type,
              dataSource:[],
              page:1,
              isOver:false,
              loaded:true
          })
        this.getAchieve()
    }

    showHeader(){
          return(
              <View style={styles.header_view}>
                  <TouchableOpacity onPress={()=>this.selectType(0)} style={styles.header_item}>
                      <Text style={this.state.type==0?{fontSize:14,color:"#f00"}:{fontSize:14,color:"#333"}}>充值业绩</Text>
                  </TouchableOpacity>
                  <TouchableOpacity onPress={()=>this.selectType(1)} style={styles.header_item}>
                      <Text style={this.state.type==1?{fontSize:14,color:"#f00"}:{fontSize:14,color:"#333"}}>销售业绩</Text>
                  </TouchableOpacity>
              </View>
          )
    }

    onEndReached(){
        if(!this.state.isOver){
            this.getAchieve()
        }
    }
    _renderRow(item){
        return(
            <View key={item.order_id} style={styles.list_item}>
                <View style={styles.txt_wrap}>
                    <Text style={{fontSize:14,color:"#333"}}>订单号：{item.order_sn}</Text>
                </View>
                <View style={styles.txt_wrap}>
                    <Text style={{fontSize:14,color:"#333"}}>订单金额：{item.order_amount}</Text>
                </View>
                <View style={styles.txt_wrap}>
                    <Text style={{fontSize:14,color:"#333"}}>付款时间：{item.pay_time}</Text>
                </View>
                <View style={styles.txt_wrap}>
                    <Text style={{fontSize:14,color:"#333"}}>下单用户：{item.user_name}</Text>
                </View>
            </View>
        )
    }
    renderFooter(){
        return (
            <View style={{height:30,alignItems:'center',justifyContent:'center'}}>
                <Text style={{fontSize:12,color:"#969696"}}>{this.state.isOver?"没有更多数据了":"正在加载中"}</Text>
            </View>
        )
    }

      render(){
          return(
              <View style={{flex:1,backgroundColor:"#f0f0f0"}}>
                  <Header navigator={this.props.navigator} initObj={{ title:'业绩明细',id:2}}/>
                  {
                      this.showHeader()
                  }
                  {
                      this.state.loaded?
                          <View style={{flex:1}}>
                              {Util.loading()}
                          </View>
                          :
                          <View style={{flex:1}}>
                              {
                                  this.state.monthStatistics==null?
                                      null:
                                      <View style={styles.month_num}>
                                        <Text style={{fontSize:18,color:"#F75061"}}>{this.state.monthStatistics.month}月度销售总业绩： ¥{this.state.monthStatistics.sum_amount}</Text>
                                      </View>
                              }
                              {
                                  this.state.dataSource.length==0?
                                      <View style={{flex:1, alignItems:'center',justifyContent:'center'}}>
                                          <Text>没有业绩数据</Text>
                                      </View>
                                      :
                                      <ListView
                                          dataSource={this.state.dataSource2}
                                          onEndReached={this.onEndReached}
                                          renderRow={this._renderRow}
                                          renderFooter={this.renderFooter}
                                      />
                              }
                          </View>
                  }

              </View>
          )
      }
}
var styles = StyleSheet.create({
    header_view:{
        height:40,
        backgroundColor:"#fff",
        flexDirection:'row',
    },
    header_item:{
        height:40,
        flex:1,
        alignItems:'center',
        justifyContent:'center'
    },
    month_num:{
        height:50,
        alignItems:'center',
        justifyContent:'center'
    },
    list_item:{
        paddingHorizontal:10,
        backgroundColor:"#fff",
        marginBottom:10,
        paddingVertical:5
    },
    txt_wrap:{
        height:30,
        justifyContent:'center',
    }
})